<div class="section" [ngClass]="{ circle: defaultStyle === '1', rectangle: defaultStyle === '2' }"
  [ngStyle]="tagData.cssStyle|styleFilter">
  <div class="topLeftDivBox" *ngIf="tagData.data?.link?.params?.topLeftDivBoxCssStyle"
    [ngStyle]="tagData.data?.link?.params?.topLeftDivBoxCssStyle|styleFilter"></div>
  <img *ngIf="tagData.data?.img" class="topLeftImg" src="{{tagData.data.img}}" alt=""
    [ngStyle]="tagData.data?.link?.params?.imgCssStyle|styleFilter">
  <ng-container *ngIf="tagData.data?.link?.params?.disableDivClickEvent!==undefined; else orginalLinkTemplate">
    <div class="title" *ngIf="tagData.data.title" [ngStyle]="tagData.data?.link?.params?.titleBoxCssStyle|styleFilter">
      <div *ngIf="tagData.data.title" [ngStyle]="tagData.data?.link?.params?.titleCssStyle|styleFilter">
        <p *ngIf="tagData.data.title" [innerHTML]="tagData.data?.title | parseStyle"></p>
        <span class="title1" *ngIf="tagData.data?.link?.params"
          [ngStyle]="tagData.data?.link?.params?.title1CssStyle|styleFilter">{{tagData.data?.link?.params?.title1}}</span>
      </div>
      <div class="all" [ngStyle]="tagData.data?.link?.params?.allBoxCssStyle|styleFilter"
        *ngIf="tagData['data']['link']" appDebounceClick
        (debounceClick)="clickAll(tagData['data']['link'],$event,tagData['data'])">
        <span [ngStyle]="tagData.data?.link?.params?.arrowLabelCssStyle|styleFilter">{{ tagData["data"]["link"]["label"]
          }}</span>
        <span class="title1" *ngIf="tagData.data?.link?.params?.label2"
          [ngStyle]="tagData.data?.link?.params?.label2CssStyle|styleFilter">{{tagData.data?.link?.params?.label2}}</span>
        <ng-container *ngIf="!tagData.data?.link?.params?.hiddenArrow">
          <img [src]='tagData.data?.link?.params?.arrowIcon' onerror="this.src='assets/icon/arrow_icon_right@3x.png'"
            [ngStyle]="tagData.data?.link?.params?.arrowIconCssStyle|styleFilter" />
        </ng-container>
      </div>
    </div>
  </ng-container>
  <ng-template #orginalLinkTemplate>
    <div class="title" appDebounceClick (debounceClick)="clickAll(tagData['data']['link'],$event,tagData['data'])"
      *ngIf="tagData.data.title" [ngStyle]="tagData.data?.link?.params?.titleBoxCssStyle|styleFilter">
      <div *ngIf="tagData.data.title" [ngStyle]="tagData.data?.link?.params?.titleCssStyle|styleFilter">
        <img *ngIf="tagData.data?.link?.params?.img" [src]='tagData.data?.link?.params?.img'
          onerror="this.src='assets/icon/arrow_icon_right@3x.png'"
          [ngStyle]="tagData.data?.link?.params?.imgCssStyle|styleFilter" />
        <p *ngIf="tagData.data.title" [innerHTML]="tagData.data?.title | parseStyle"></p>
        <span class="title1" *ngIf="tagData.data?.link?.params"
          [ngStyle]="tagData.data?.link?.params?.title1CssStyle|styleFilter">{{tagData.data?.link?.params?.title1}}</span>
        <span class="title2" *ngIf="tagData.data?.link?.params"
          [ngStyle]="tagData.data?.link?.params?.title2CssStyle|styleFilter">{{tagData.data?.link?.params?.title2}}</span>
      </div>
      <div class="all" [ngStyle]="tagData.data?.link?.params?.allBoxCssStyle|styleFilter"
        *ngIf="tagData['data']['link']" appDebounceClick
        (debounceClick)="clickAll(tagData['data']['link'],$event,tagData['data'])">
        <span [ngStyle]="tagData.data?.link?.params?.arrowLabelCssStyle|styleFilter">{{ tagData["data"]["link"]["label"]
          }}</span>
        <span class="title1" *ngIf="tagData.data?.link?.params?.label2"
          [ngStyle]="tagData.data?.link?.params?.label2CssStyle|styleFilter">{{tagData.data?.link?.params?.label2}}</span>
        <ng-container *ngIf="!tagData.data?.link?.params?.hiddenArrow">
          <img [src]='tagData.data?.link?.params?.arrowIcon' onerror="this.src='assets/icon/arrow_icon_right@3x.png'"
            [ngStyle]="tagData.data?.link?.params?.arrowIconCssStyle|styleFilter" />
        </ng-container>
      </div>
    </div>
  </ng-template>
  <div class="tools" [ngStyle]="tagData.data?.link?.params?.toolsBoxCssStyle|styleFilter">
    <ng-container *ngIf="tagData.data?.link?.params?.layoutType; else elseNormalLayoutTemplate">
      <table border="0" [ngStyle]="tagData.data?.link?.param?.tableCssStyle|styleFilter">
        <tr [ngStyle]="tagData.data?.link?.param?.tableRowCssStyle|styleFilter">
          <ng-container *ngFor="let item of this.firstRowData,let dataIndex = index;">
            <td [ngStyle]="tagData.data?.link?.param?.tableSingleBoxCssStyle|styleFilter">
              <div *ngIf="dataIndex < showIconLimit" class="item 1"
                [ngStyle]="item?.link?.params?.itemCssStyle|styleFilter" appDebounceClick
                (debounceClick)="handleClick(item,item['tip'])" [ngClass]="{'buttonArray_NewStyle':
                item.buttonArrayStyle!==undefined&&item.buttonArrayStyle==='buttonArray'
                }">

                <ng-container *ngIf="item.link&&item.link.params!==undefined&&item.link.params.badge!==undefined">
                  <ion-badge class="topBadge2 badgePosition"
                    [ngClass]="{'newBadgeStyle': item.link?.params?.badgeLabelCssStyle}"
                    *ngIf="item.link.params.badge!=='0'" [ngStyle]="item.link?.params?.badgeCssStyle|styleFilter">
                    <span [ngStyle]="item.link?.params?.badgeLabelCssStyle|styleFilter">
                      {{item.link.params.badge}}</span>
                  </ion-badge>
                </ng-container>


                <ng-container *ngIf="item.selected&&item.selected==='true'; else elseUnSelectedImgTemplate">
                  <div [ngStyle]="item?.selectedImageBoxCssStyle|styleFilter">

                  <ng-container *ngIf="item.label==='精选'; else elseGpTemplate">
                    <img *ngIf="item.selectedJpIcon" src="{{item.selectedJpIcon}}"
                      [ngStyle]="item.link?.params?.iconCssStyle|styleFilter"
                      onerror="this.src='assets/img/default_rk.png'" />
                  </ng-container>
                  <ng-template #elseGpTemplate>
                    <img *ngIf="item.selectedGpIcon" src="{{item.selectedGpIcon}}"
                      [ngStyle]="item.link?.params?.iconCssStyle|styleFilter"
                      onerror="this.src='assets/img/default_rk.png'" />
                  </ng-template>
                  </div>
                </ng-container>
                <ng-template #elseUnSelectedImgTemplate>
                  <img *ngIf="item.iconName" src="{{item.iconName}}"
                    [ngStyle]="item.link?.params?.iconCssStyle|styleFilter"
                    onerror="this.src='assets/img/default_rk.png'" />
                </ng-template>
                <ng-container *ngIf="item.selected&&item.selected==='true'; else elseUnSelectedLabeTemplate">
                  <p *ngIf="item.label" [ngStyle]="item.labelCheckCssStyle|styleFilter">{{ item.label }}</p>
                </ng-container>
                <ng-template #elseUnSelectedLabeTemplate>
                  <p *ngIf="item.label" [ngStyle]="item.link?.params?.labelCssStyle|styleFilter">{{ item.label }}</p>
                </ng-template>
              </div>
            </td>
          </ng-container>
        </tr>
        <tr [ngStyle]="tagData.data?.link?.param?.tableRowCssStyle|styleFilter">
          <ng-container *ngFor="let item of this.secondRowData,let dataIndex = index;">
            <td [ngStyle]="tagData.data?.link?.param?.tableSingleBoxCssStyle|styleFilter">
              <div *ngIf="dataIndex < showIconLimit" class="item 2"
                [ngStyle]="item?.link?.params?.itemCssStyle|styleFilter" appDebounceClick
                (debounceClick)="handleClick(item,item['tip'])">
                <ng-container *ngIf="item.link&&item.link.params!==undefined&&item.link.params.badge!==undefined">
                  <ion-badge class="topBadge2 badgePosition"
                    [ngClass]="{'newBadgeStyle': item.link?.params?.badgeLabelCssStyle}"
                    *ngIf="item.link.params.badge!=='0'" [ngStyle]="item.link?.params?.badgeCssStyle|styleFilter">
                    <span [ngStyle]="item.link?.params?.badgeLabelCssStyle|styleFilter">
                      {{item.link.params.badge}}
                    </span>
                  </ion-badge>
                </ng-container>
                <img *ngIf="item.iconName" src="{{item.iconName}}"
                  [ngStyle]="item.link?.params?.iconCssStyle|styleFilter"
                  onerror="this.src='assets/img/default_rk.png'" />
                <p *ngIf="item.label" [ngStyle]="item.link?.params?.labelCssStyle|styleFilter">{{ item.label }}</p>
              </div>
            </td>
          </ng-container>
        </tr>
      </table>
    </ng-container>
    <ng-template #elseNormalLayoutTemplate>
      <!-- 蜂喔商户1.6.33新增商家服务管理 -->
      <ng-container *ngFor="let item of tagData['data']['data'],let dataIndex = index;">
        <div *ngIf="dataIndex < showIconLimit" class="item 3" [ngStyle]="item?.link?.params?.itemCssStyle|styleFilter"
          appDebounceClick (debounceClick)="handleClick(item,item['tip'])">
          <ng-container *ngIf="item.link&&item.link.params!==undefined&&item.link.params.badge!==undefined">
            <ion-badge class="topBadge2 badgePosition"
              [ngClass]="{'newBadgeStyle': item.link?.params?.badgeLabelCssStyle}" *ngIf="item.link.params.badge!=='0'"
              [ngStyle]="item.link?.params?.badgeCssStyle|styleFilter">
              <span [ngStyle]="item.link?.params?.badgeLabelCssStyle|styleFilter">
                {{item.link.params.badge}}
              </span>
            </ion-badge>
          </ng-container>
          <img *ngIf="item.iconName" src="{{item.iconName}}" [ngStyle]="item.link?.params?.iconCssStyle|styleFilter"
            onerror="this.src='assets/img/default_rk.png'" />
          <p *ngIf="item.label" [ngStyle]="item.link?.params?.labelCssStyle|styleFilter">{{ item.label }}</p>
        </div>
      </ng-container>

    </ng-template>
  </div>

  <!--1.6.33新增按钮-->
  <div class="bottomBox" *ngIf="tagData.data?.link?.params?.showExpendButton"
    [ngStyle]="tagData.data?.link?.params?.expendBoxCssStyle|styleFilter">
    <img class="expendImagUrl" id="{{expendIconId}}" *ngIf="tagData.data?.link?.params?.openImagUrl"
      [src]="tagData.data?.link?.params?.openImagUrl"
      onerror="this.src='https://zeno-img.oss-cn-shenzhen.aliyuncs.com/file_1667800066095674c9d075dd52a2ebe563edbec6524c0.png'"
      [ngStyle]="tagData.data?.link?.params?.imagUrlCssStyle|styleFilter" appDebounceClick (debounceClick)="expend()" />
  </div>

</div>